<script src="./home.js"></script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style src="./home.less" lang="less" scoped></style>

<template>
    <div class="home">
        <div class="head">
            <img src="~assets/img/home-bg-1.jpg" alt="">
        </div>
        <router-link to="/sign">
            <div class="c-btn">我要报名</div>
        </router-link>
        <div class="explain">
            <label>发起单位：</label>南都健康大讲堂&德视佳眼科<br>
            <label>参与对象：</label>全世界的近视党<br>
            <label>报名时间：</label>2017年4月25日-5月9日<br>
            <label>参与方式：</label>点击进入报名页面，填写报名资料，<br>审核通过后即可参与竞选投票。最终网络票选结果<br>第一名为本次活动的优胜者。
            <p>注：活动解释权归主办方所有</p>
        </div>
        <div class="round">参与人员</div>
        <!--列表-->
        <ul class="ul">
            <li v-for="(i,index) in listItem">
                <router-link :to="{ name: 'detail', params: { gid: i.id }}">
                    <div class="img"><img src="~assets/img/test-1.jpg" v-bind:src="i.imageurl"></div>
                    <div class="name">{{i.name}}</div>
                    <div class="number">{{i.votecount}}票</div>
                </router-link>
                <div class="btn" v-on:click="vote(i.id,index)">投TA一票</div>
            </li>
            <li id="more" class="more" v-if="listMore">
                <span v-show="loadlock">下拉加载更多…</span>
                <span v-show="!loadlock">加载中…</span>
            </li>
        </ul>

        <my-component ref="alerts"></my-component>
    </div>
</template>
